<script setup lang="ts">
import { CopyOutlined } from '@ant-design/icons-vue'
import { message } from 'ant-design-vue'

export interface CopyProps {
  value?: string;
  successText?: string;
}

const props = withDefaults(defineProps<CopyProps>(), {
  value: '',
  successText: '已复制到剪切板'
})

const writeClipboard = () => {
  navigator.clipboard.writeText(props.value)
  message.success(props.successText)
}

</script>

<template>
  <div class="flex cursor-pointer items-center space-x-1" @click="writeClipboard">
    <slot />
    <CopyOutlined />
  </div>
</template>